<template>
	<!-- 头部 -->
	<view class="codeFills">
		<uni-nav-bar title="扫码加注" color="#333" left-icon="left" @clickLeft="redirectTo('index/filling')"
			statusBar></uni-nav-bar>
		<environment></environment>
		<!-- 安蓝头部标题 -->
		<CodeTop></CodeTop>
		<!-- 金额显示 -->
		<view class="package">
			<PriceList :fill_price="storeAll.wechat_price" :vip_price="storeAll.money_price"
				:TeamName="storeAll.shop_name" :locationName="positionText.name" :type="'shop'"
				:PaymentMethod="PaymentMethod"></PriceList>
		</view>
		<!-- 自定义加注金额 -->
		<CodeFilli :wechat_price="storeAll.wechat_price" :money_price="storeAll.money_price"
			:wechat_amount="Pricegroup.wechat_amount" :money_amount="Pricegroup.money_amount" :num="num"
			@activeTab="activeTab" @getdrivers="getdrivers" :type="'team'" ref="CodeFilliRef" @payForSub="payForSub"
			:code="positionText.code">
		</CodeFilli>
		<!-- 底部支付 -->
		<CodeFilliBot :type="'team'" :state="'shop'" :teamId="teamId" :num="num" :from_id="from_id" ref="disbursement"
			:code="positionText.code">
		</CodeFilliBot>
		<!-- 获取当前经纬度 -->
		<!-- <Lotlats @position="position"></Lotlats> -->
		<webWechat></webWechat>
	</view>
</template>

<script setup lang="ts">
	import { fillingListA } from '@/gql/filling';
	import { getDriverID } from '@/stores/driverID';
	import CodeTop from '@c/canCode/codeTop.vue';
	import { redirectTo, navBack, navTo } from '@/utils/navigator';
	import { errorToast, showLoading } from '@/utils/prompt';
	import PriceList from '@c/canCode/priceList.vue';
	// import Lotlats from '@c/team/Lotlat.vue';
	import environment from '@c/pobulic/environment.vue';
	import webWechat from '@c/pobulic/webWechat.vue';
	import CodeFilli from '@c/canCode/CodeFilli.vue';
	import CodeFilliBot from '@c/canCode/CodeFilliBot.vue';
	import { GetCities } from '@/gql/team';
	import { onLoad } from '@dcloudio/uni-app';
	import { ShopNotes, ShopNoteOrder } from '@/gql/team';
	import { toPublish } from '@mqtt';
	import { Ref, ref } from 'vue';
	/**
	 * @component
	 * @desc 店铺联营机加注页面
	 * @property {Number} driver_id 用户ID
	 * @property {Number} num 用户加注金额
	 * @property {Object} Pricegroup 用户支付金额及加注量
	 * @property {Object} positionText 当前城市的code值及城市名
	 * @property {Number} from_id //待支付人ID
	 * @property {Null} CodeFilliRef //自定义加注金额值
	 * @property {String} getCityCode //当前城市的codeh值
	 * @property {Number} teamId // 团ID
	 * @property {Object} storeAll 店铺信息
	 * @property {String} PaymentMethod 支付方式
	 */
	// static
	const driver_id = getDriverID();
	// data
	const Pricegroup : Ref<any> = ref({});
	const positionText : Ref<any> = ref({});

	const num = ref(15);
	const from_id = ref(0); //待支付人ID
	// refs
	const CodeFilliRef = ref(null);
	const disbursement = ref(null)
	const teamId = ref(0);
	const storeAll = ref();
	const PaymentMethod = ref('')
	onLoad((pearm) => {
		teamId.value = pearm.id;
		StoreInformation();
		fillLists();
		position();
	});
	/**
	 * 获取加注机详情
	 */
	function fillLists() {
		const fillID = uni.getStorageSync('fillingID');
		if (!fillID) {
			errorToast('扫码失败 请重新扫描');
			setTimeout(() => {
				navBack();
			}, 1000);
			return;
		}
		const payload = {
			query: fillingListA,
			variables: {
				driver_id,
				id: fillID.toString(),
			},
		};
		toPublish('ql/driver/getFilling', payload, (obj : any) => {
			uni.hideLoading();
			const { fill } = obj.data;
			uni.setStorageSync('fillingID', fill.id);
			uni.setStorageSync('jzjfilling', fill.imsi);
		});
	}
	/**
	 * 获取根据当前加注机经纬度的城市信息
	 */
	function position() {
		showLoading();
		const payload = {
			query: GetCities,
			variables: {
				fill_id: uni.getStorageSync('fillingID').toString()
			},
		};
		toPublish('ql/team/getCity', payload, (obj : any) => {
			uni.hideLoading();
			const { data } = obj;
			positionText.value = data.get_city;
		});
	}
	/**
	 * 获取店铺信息
	 */
	function StoreInformation() {
		showLoading();
		const payload = {
			query: ShopNotes,
			variables: {
				id: Number(teamId.value),
			},
		};
		toPublish('ql/shop/getPartnersInfo', payload, (obj : any) => {
			uni.hideLoading();
			const { data } = obj;
			storeAll.value = data.get_shop_filling;
			setTimeout(() => {
				getdrivers(15);
			}, 200);
		});
	}
	/**
	 * 获取单价及加注量
	 * @param {Number} price 加注金额
	 */
	function getdrivers(price : number) {
		if (!storeAll.value.wechat_price) {
			return
		}
		showLoading();
		num.value = price;
		const payload = {
			query: ShopNoteOrder,
			variables: {
				wechat_price: Number(storeAll.value.wechat_price),
				money_price: Number(storeAll.value.money_price),
				price: Number(price),
			},
		};
		toPublish('ql/shop/getShopFillPrice', payload, (obj : any) => {
			uni.hideLoading();
			const { data } = obj;
			Pricegroup.value = data.fill_amount;
			setTimeout(() => {
				if (price === 15) {
					CodeFilliRef.value.customLists()
				} else {
					CodeFilliRef.value.bindChange()
				}
			}, 150)
		});
	}
	/**
	  * 选择代付款人
	  * @param {Number} num 代付款人ID
	  * @param {String} type 付款方式
	  */
	function activeTab(num : number, type : string) {
		PaymentMethod.value = type
		from_id.value = num;
	}
	/**
	 * 提交支付
	 * @param {Object} type 支付方式
	 * @param {Object} amount 加注量
	 * @param {Object} price 加注单价
	 */
	function payForSub(type : string, amount : number, price : number, text : any) {
		if (text === 'Recharge') {
			navTo('mine/Recharge?amount=' + amount + '&price=' + price + '&teamId=' + teamId.value + '&state=shop' + '&type=team' + '&money=' + num.value)
		} else {
			disbursement.value.submit(type, amount, price)
		}
	}
</script>

<style lang="less"></style>
<style>
	.codeFills>>>.uni-popup__wrapper {
		border-radius: 5px !important;
	}
</style>